*{
	margin:0;
	padding:0;
	font-size: 14px;
	color:#fff;
}
body,html{
	font-family: Microsoft Yahei,Verdana, Geneva, sans-serif;
	overflow: hidden;
	/*background: url(/static/images/base_bck.jpg) no-repeat;*/
	background-size: cover;
}

/*滚动条样式开始*/
::-webkit-scrollbar/*整体部分*/
{
    width: 7px !important;;
    height:7px !important;;
}

::-webkit-scrollbar-track/*滑动轨道*/
{
    -webkit-box-shadow: inset 0 0 5px #232c32 !important;;
    border-radius: 0px !important;;
    background: #232c32 !important;
}

::-webkit-scrollbar-thumb/*滑块*/
{
    border-radius: 5px !important;;
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.4) !important;;
    background: #3F5462 !important;;
}

::-webkit-scrollbar-thumb:hover/*滑块效果*/
{
    border-radius: 5px !important;;
    -webkit-box-shadow: inset 0 0 5px #3F5462 !important;;
    background: #3F5462 !important;;
}

select{
    scrollbar-face-color:#FFFFFF;
    scrollbar-shadow-color:#C1C1BB;
    scrollbar-highlight-color:#C1C1BB;
    scrollbar-3dlight-color:#EBEBE4;
    scrollbar-darkshadow-color:#EBEBE4;
    scrollbar-track-color:#F4F4F0;
    scrollbar-arrow-color:#CACAB7;
}
/*滚动条样式结束*/
/* 顶部导航栏样式开始 */
.top-container{
	width:100%;
	height:50px;
	line-height: 50px;
	background: #021628;
	position: relative;
}
.top-container div{
	width:230px;
	font-size: 14px;
	display: inline-block;
}
.logo{
	width:200px;
	height:40px;
	margin-top:5px;
	margin-left:44px;
	vertical-align: top;
}
.saveToDesk{
	margin-left:130px;
	text-indent:25px;
	font-size:16px !important;
	background: url(/static/images/save_to_desktop.png) left center no-repeat;
	background-size:17px 15px;
}
.phoneToView{
	cursor: pointer;
	margin-left:-60px;
	text-indent:17px;
	font-size:16px !important;
	background: url(/static/images/phone.png) left center no-repeat;
	background-size:11px 17px;
}
.account{
	position: absolute;
	right:100px;
	cursor:pointer;
}
.account a{
	color:#fff;
}
.account a:hover{
	color:#f00;
}
.login{
	margin-left: 5px;
}
/* 顶部导航栏样式结束 */
/* 左侧模块样式开始 */
.side-left-container{
	vertical-align: top;
	width:185px;
	display: inline-block;
	margin:0;
	height:calc(100vh - 50px);
	background:rgba(44,43,43,0.8);
	position: relative;
}
.side-left-nav{
	position: absolute;
	top:16px;
	width:clac(100% - 32px);
	left:16px;
	background:rgba(44,43,43,0.9);
	width:153px;
	border-radius: 5px;
}
.side-left-nav li{
	width:100%;
	height:52px;
	line-height: 52px;
	list-style-type:none; 
	position: relative;
	text-indent:60px;
}
.side-left-nav li span:hover{
	color:red;
	cursor: pointer;
}
.side-left-nav li:not(:last-child){
	border-bottom:1px #3C4049 solid;
}
.side-left-nav li img{
	position: absolute;
	left:16px;
	width:24px;
	height:24px;
	top:16px;
}
.side-left-nav2{
	width:100%;
	height:calc(100vh - 400px);
	position: absolute;
	bottom:5px;
	background:rgba(44,43,43,1);
	border-radius: 10px;
}
.user-msg{
	width:100%;
	height:66px;
	border-bottom:1px #3C4049 solid;
	position: relative;
}
.user-msg-img{
	width:62px;
	height:62px;
	position: absolute;
	border-radius: 100%; 
	top:-10px;
	left:5px;
}
.user-msg-div{
	width:100px;
	height:52px;
	margin-left: 80px;
}
.user-name{
	font-size:14px;
}
.user-nav{
	width: clac(100% - 32px);
	height:50px;
	line-height:50px;
	border-bottom:1px #3C4049 solid;
	padding:8px 16px;
}
.user-nav li{
	width:70px;
	height:40px;
	padding-top:5px;
	display: inline-block;
	text-align: center;
	cursor: pointer;
}
.user-nav li:hover{
	background: #484545;
	border-radius: 5px;
}
.user-nav-selected{
	background: #484545;
	border-radius: 5px;
}
.user-nav p{
	line-height: 18px;
	font-size:14px;
}
.user-content{
	width:100%;
	height:calc(100vh - 560px);
	overflow-y: auto;
	overflow-x: hidden;
}
.user-content li{
	width:calc(100% - 32px);
	height:60px;
	margin-left:16px;
	position: relative;
	list-style-type: none;
	padding-top:10px;
}
.user-content li:hover{
	background: #484545;
	border-radius: 5px;
	height: 60px;
}
.user-content-img{
	width:40px;
	height:40px;
	position: absolute;
	left:5px;
	top:10px;
	border-radius: 100%;
}
.user-content-div{
	width:clac(100% - 40px);
	height:40px;
	position: absolute;
	left:50px;
}
#user-nav2-content li{
	height:108px;
}
.QQ{
	position: absolute;
	top: 60px;
    left:-35px;
    width: 130px;
    height: 28px;
    border: 1px solid #ee433e;
    border-radius: 6px;
    text-align: center;
    cursor: pointer;
    line-height: 28px;
    color:#ee433e;
    font-size:12px;
}

/* 左侧模块样式结束 */
/* 中间模块样式开始 */
.center-container{
	width:calc(70% - 205px);
	display: inline-block;
	margin:0;
	height:calc(100vh - 50px);
	vertical-align: top;
	overflow-y:auto;
	margin-left:5px;
}
.center-nav{
	width:100%;
	height:60px;
	line-height: 60px;
	background: #0A1F31;
	margin-top:6px;
}
.center-nav-img{
	width:40px;
	height:40px;
	line-height: 60px;
	margin-left:16px;
	margin-top:10px;
}
.center-nav-class{
	display: inline-block;
	font-size:18px;
	margin-left:16px;
	vertical-align: top;
	line-height: 60px
}
.center-nav-teacher{
	display: inline-block;
	line-height: 60px;
	vertical-align: top;
	margin-left:16px;
	font-size:16px;
}
.popularity{
	display: inline-block;
	line-height: 60px;
	height:60px;
	vertical-align: top;
	margin-left:50px;
}
.popularity img{
	width:18px;
	height:18px;
	line-height: 60px;
	display: inline-block;
	vertical-align: middle;
}
.popularity span{
	color:#fff;
	margin-left: 6px;
	font-size:16px;
	display: inline-block;
	vertical-align: middle;
}
.center-select{
	width:50px;
	line-height: 50px;
	display: inline-block;
	vertical-align: top;
	 border:1px solid #627B8C;
    border-radius:3px;
    outline-color:#0A1F31;
    color:#bad2e3;
    padding-left:10px;
    width:210px;
    height:34px;
    line-height:34px;
    appearance:none;
    -webkit-appearance:none;
    background: #0A1F31;
    margin-top:15px;
    margin-left:16px;
}
.share,.refresh{
	display: inline-block;
	width:65px;
	text-indent: 25px;
	vertical-align: top;
	height:30px;
	line-height: 30px;
	margin-top:10px;
	float: right;
	margin-right:16px;
	cursor: pointer;
	font-size:16px;
}
.share{
	background: url(/static/images/share.png) no-repeat left center;
	background-size:18px 18px;
}
.refresh{
	background: url(/static/images/vod.png) no-repeat left center;
	background-size:18px 18px;
	margin-right:6px;
}
.center-content{
	width:100%;
	height:75vh;
}
.center-content img{
	width:100%;
	height:100%;
}
.center-bar{
	width:100%;
	height:300px;
	background:rgba(44,43,43,0.9);
	margin-bottom:10px;
	border-radius: 5px;
}
.center-signin{
	width:100%;
	height:56px;
	background:rgba(44,43,43,0.4);
}
.center-signin img{
	width:54px;
	height:39px;
	margin:10px 16px;
	cursor: pointer;
}
/* 中间模块样式结束 */
/* 右侧模块样式开始 */
.side-right-container{
	vertical-align: top;
	width:30%;
	display: inline-block;
	margin:0;
	height:calc(100vh - 100px);
}
.right-nav{
	width: 100%;
	height:30px;
	line-height: 30px;
	background:rgba(44,43,43,0.9);
	color:#d00000;
	text-align: center;
	margin-top:6px;
}
.right-welcome{
	display: inline-block;
	height:30px;
	width: 100%;
	line-height: 30px;
	background:rgba(44,43,43,0.5);
	text-align: center;
	position: relative;
	overflow: hidden;
}
.welcome-text{
	position: absolute;
	left:100%;
	top:0px;
	color:#d00000;
}
.right-msg{
	background:rgba(44,43,43,0.8);
	margin-top:-5px; 
}
.right-msg p{
	text-align: center;
	color:#7B7D7F;
	font-size:14px;
}
.right-msg-meet{
	width:100%;
	height:calc(100vh - 270px);
	overflow: auto;
	padding-bottom: 16px;
}
.right-msg-meet li{
	/*height:70px;*/
	margin-bottom: 8px;
	list-style-type: none;
	position: relative;
}
.meet-img{
	position: absolute;
	border-radius: 100%;
	left:16px;
	width:35px;
	height:35px;
	top:16px;
}
.meet-pic{
	width:60px;
	height:30px;
	margin-left:60px;
	vertical-align: middle;
}
.meet-name{
	height:30px;
	margin-left:16px;
	font-size:14px;
}
.meet-time{
	height:15px;
	margin-left:10px;
	background:rgba(44,43,43,0.9);
	border-radius: 10px; 
	padding:3px 10px;
	color:#7B7D7F;
	margin-left:16px;
	font-size:12px;
}
.meet-msg{
	/*position: absolute;
	left:60px;
	top:40px;*/
	width: calc(100% - 100px );
    margin-left: 60px;
	background:#E7EBF2;
	border-radius: 4px; 
	padding:5px 10px;
	color:#333;
}
.tool-bar{
	width:100%;
	height:30px;
	line-height: 30px;
	background:rgba(44,43,43,0.8);
}
.face{
	width:18px;
	height:18px;
	line-height: 30px;
	margin:5px 12px;
	vertical-align: middle;
}
.colorbar{
	width:18px;
	height:18px;
	line-height: 30px;
	margin-right:5px;
	vertical-align: middle;
}
.clear,.scroll{
	width:65px;
	height:20px;
	line-height: 20px;
	text-indent:30px;
	border-radius: 10px;
}
.clear{
	background:rgba(44,43,43,0.9)  url(/static/images/del.png) no-repeat left 10px center;
	background-size: 12px 12px;
	position: absolute;
	bottom:140px;
	right:100px;
	z-index: 10;
}
.scroll{
	background:rgba(44,43,43,0.9)  url(/static/images/unlock.png) no-repeat left 10px center;
	background-size: 12px 12px;
	position: absolute;
	bottom:140px;
	right:20px;
	z-index: 10;
}
.dj{
	background-color: #d00000;
	border-radius:2px;
	height:20px;
	vertical-align: middle;
	line-height: 20px;
	padding:1px 10px;
	display: inline-block;
}
.bom-bar{
	display: inline-block;
	width:calc(100% - 105px);
	height:80px;
	background:rgba(44,43,43,0.8);
	margin-top:5px;
	vertical-align: top;
	border:none;
}
.send{
	display: inline-block;
	width:90px;
	margin-left:5px;
	vertical-align: top;
	height:80px;
	background:red;
	margin-top:5px;
	cursor: pointer;
}
/* 右侧模块样式结束 */
.scroll-notice{
	color: #f00;
}
.message-menu{
	width: 300px;
	margin-top: 5px;
	margin-left: 60px;
}
.message-menu ul li{
	float: left;
	width: 50px;
	margin-right: 5px;
}
.account-head{
	width: 40px;
	height: 40px;
	border-radius: 100%; 
}
.account-name{

}
#speak_role{
	background-color:#fff;
	color: #333
}
#speak_role option{
	color: #333
}
#speak_time{
	background-color:#FFF;
	color: #333
}
#speak_time option{
	color: #333
}
.colorbar_list{
	display: none;
}